import React from 'react'
import { Link, Outlet, useHref } from 'react-router-dom'

const Index = () => {
  const userHref = useHref('user')
  const foodHref = useHref('food')

  return (
    <div>
      <h3>后台管理</h3>
      {/* <Link to="/admin/user">用户</Link>&nbsp;&nbsp;|&nbsp;&nbsp;
      <Link to="/admin/food">食材</Link> */}
      <Link to={userHref}>用户</Link>&nbsp;&nbsp;|&nbsp;&nbsp;
      <Link to={foodHref}>食材</Link>
      <hr />
      {/* 子路由匹配成功后渲染的占位组件 */}
      <Outlet />
    </div>
  )
}

export default Index
